<template>
    <div class="page">
      <div class="footer_box">
        <div class="icon" @click="$goPage('/')">
          <div><i class="el-icon-s-home"></i></div>
          <div>首页</div>
        </div>
        <div class="icon" @click="$goPage('/cate')">
          <div><i class="el-icon-s-claim"></i></div>
          <div>分类</div>
        </div>
        <div class="icon" @click="$goPage('/cart')">
          <div><i class="el-icon-shopping-cart-full"></i></div>
          <div>购物车</div>
        </div>
        <div class="icon" @click="$goPage('/my')">
          <div><i class="el-icon-s-custom"></i></div>
          <div>我的</div>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    name: "footer",
    methods: {
  
    }
  }
  </script>
  
  <style scoped>
  .footer_box {
    width: calc(100% - 40px);
    height: 45px;
    background-color: #FFFFFF;
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding: 8px 20px;
    border-top: 1px solid #EEEEEE;
  }
  
  i {
    font-size: 22px;
  }
  </style>
  